Linking to Photoshop files

Adobe GoLive lets you link to Adobe Photoshop files on a Web page. PSD files must be RGB 8-bit images and can be sliced (any attached interactivity such as rollovers or image maps and frame-based animations are ignored). The procedures for linking to simple and sliced Photoshop images differs somewhat, as noted in this section.

Note: Images with attached interactivity or frame-based animations must be properly exported from within Adobe ImageReady. See the Adobe ImageReady User Guide for details on exporting such images to an Adobe GoLive-friendly format.

Adobe GoLive also supports BMP, PICT (Mac OS only), PCX, Pixar, Amiga IFF, TIFF, and TARGA. Adobe GoLive creates a copy of the source file in a Web-safe format and maintains a link, called a Smart Link, between the two files. If you later make changes to the source image or resize the Smart Photoshop object, Adobe GoLive automatically updates the Web-safe copy when you return to the page containing the image. You can also double-click a Smart Photoshop object in the document window to open the original source image in Adobe Photoshop.

Note: Layered Photoshop files imported as Smart Objects are flattened into one image during the optimization and conversion process. If you want to keep the layers as distinct images, see Working with Photoshop layered files.

Adobe GoLive offers extensive control over the optimization of images linked to as Smart Photoshop objects in the Save For Web dialog box that automatically appears when you first create a Smart Photoshop object. The dialog lets you preview optimized images in different Web graphics file formats and with different file attributes. You can view multiple versions of an image simultaneously and modify optimization settings as you preview the image, to select the best combination of settings for your needs. You can also use predefined settings instead of selecting options yourself.

To add a simple Smart Photoshop object:

1 Drag the Smart Photoshop icon from the Smart tab () of the Objects palette into your document window, or double-click the icon in the palette.

2 Select the Smart Photoshop placeholder, and click the Browse button () next to the Source text box in the Smart Image Inspector.

Note: You can also select an image by dragging from the Point and Shoot button () to an image file in the site window or by dragging and dropping an image from the site window, the Finder (Mac OS), or desktop.

3 Select the desired Photoshop file and click Open.

4 In the Save For Web dialog box, click a tab at the top of the image display to select a view:

Note: For additional details on optimization views, see Viewing images during optimization.

5 Select a predefined optimization setting from the Settings pop-up menu or create your own using the available pop-up menus, and click OK.

6 Save the Web-safe copy of the source file to somewhere in the site folder (for example, the Images folder within your site folder), and click Save. If you do not save to the site folder, the link will not be valid.

When the Smart Object links to a source image that contains slices, Adobe GoLive has to save each slice as a separate image along with some HTML code. It first prompts you for a location where it automatically creates a <source image name>.data folder for the images and HTML. The folder contains the Web-safe slices as well as the HTML exported with the slices. Any interactivity attached to the slices in the original file is ignored. For images that contain frame-based animations or JavaScript interactive sliced objects, export the file from ImageReady to a Web-safe, Adobe GoLive-friendly format first and then import the exported file into Adobe GoLive.

To add a sliced Smart Photoshop object:

1 Drag the Smart Photoshop icon from the Smart tab () of the Objects palette into your document window, or double-click the icon in the palette.

2 Select the Smart Photoshop placeholder, and click the Browse button () next to the Source text box in the Smart Image Inspector.

Note: You can also select an image by dragging from the Point and Shoot button () to an image file in the site window or by dragging and dropping an image from the site window, the Finder (Mac OS), or desktop.

3 Select the desired Photoshop file and click Open.

4 In the subsequent dialog, select a destination location where you want to save the target data, and click Save.

5 In the Save For Web dialog box, click a tab at the top of the image display to select a view:

Note: For additional details on optimization views, see Viewing images during optimization.

6 Select a predefined optimization setting from the Settings pop-up menu or create your own using the available pop-up menus, and click OK. You can specify different settings for each slice. If the image was auto-sliced, one setting applies to all the slices.

Images and Page Design > Linking to Photoshop files

Related subtopics: